import React, { Component } from 'react'
import { connect } from 'dva';

import { Tabs, Modal } from 'antd';
import {Prompt} from 'react-router-dom'

import { checkInit } from '@/utils/util';
import Person from './person';

import BasicInfo from './components/BasicInfo';
import ApprovalDocuments from './components/ApprovalDocuments'

const TabPane = Tabs.TabPane;

interface IProps {
  dispatch?: Function,
  history?: {
    push: Function
  },
}

interface index {
  isSave : boolean
}

@connect()
class index extends Component<IProps> {

  // state = {
  //   isSave: false,
  // }

  componentDidMount() {
    checkInit();
    this.isSave = false;
  }

  callback = (key) => {
    sessionStorage.setItem('def_key', key);
  };

  handlePrompt = location => {
    if (!this.isSave) {
      // this.showModalSave(location);
      Modal.confirm({
        title: '内容有修改，是否保存?',
        okText: '保存',
        onCancel: () => {this.handleModalCancle(location)},
        onOk: this.handleModalSave
      })
      return false;
    }
    return true;
  };

  handleModalCancle = (location) => {
    // if (!location) {
    //   // TODO 处理非路由跳转拦截
    //   return;
    // }
    this.isSave = true;
    const { history } = this.props;

    history.push({
      pathname: `..${location.pathname}`,
    });
  };
  handleModalSave = () => {

  }

  render() {
    const defKey = sessionStorage.getItem('def_key') || '1';
    return (
      <>
        {/* <Prompt message={this.handlePrompt}/> */}
        <Tabs onChange={this.callback} defaultActiveKey={defKey}>
          <TabPane tab="基本情况介绍" key="1">
            <BasicInfo/>
          </TabPane>
          <TabPane tab="消防审批文件/资料" key="2">
            <ApprovalDocuments/>
          </TabPane>
          <TabPane tab="消防组织机构人员" key="3">
            <Person />
          </TabPane>
        </Tabs>
      </>
    )
  }
}

export default index;
